﻿@{
    ViewBag.Title = "红钻+现金";
    Layout = "~/Views/Shared/_MallLayout.cshtml";
    var img_url = ViewBag.img_url;
}
@model activity_dto
@section style{
    <link href="~/Content/css/tokenmall/css/special.css" rel="stylesheet" />
    <link href="~/Scripts/mescroll/mescroll.min.css" rel="stylesheet" />
    <style type="text/css">
        .mescroll {
            width: 100%;
            max-width: 16rem;
            position: absolute;
            top: 0;
            bottom: 0;
            height: auto;
        }
    </style>
}
    <body class="page-proList">
        <div class="mescroll" id="mescroll">
            <span class="rule" id="rule">活动规则</span>
            <div class="ad">
                <div><img align="top" src="~/Content/css/tokenmall/img/view/aigou_1.jpg" alt=""></div>
            </div>

            <div class="lt-block">
                <div class="mod-pro-1">
                    <ul class="masonry" id="dataList"></ul>
                </div>
            </div>
        </div>
        <a class="goTop">
            <img src="~/Content/css/tokenmall/img/icon/goTop.png" />
        </a>

        <div class="mask"></div>
        <!-- 活动规则弹窗 -->
        <div class="activity_modal" id="activity_modal">
            <div class="content">
                <div class="title" style="background:url(../../Content/css/tokenmall/img/view/poputop.png) no-repeat;background-size: 100% 100%;"></div>
                <div class="rulesbg">
                    <div class="activity_rules">
                        <div class="msg">
                            <h2>活动时间</h2>
                            <p>开始时间：@Model.begin_time.ToString("D")</p>
                            <p>结束时间：@Model.end_time.ToString("D")</p>
                        </div>
                        <div class="msg msg2">
                            <h2>活动规则</h2>
                            @Html.Raw(Model.detail)
                        </div>
                    </div>
                </div>
                <div class="close" id="close" style="background:url(../../Content/css/tokenmall/img/popup3.png) no-repeat;background-size: 100% 100%;"></div>
            </div>
        </div>


        <script src="~/Scripts/mescroll/mescroll.min.js"></script>
        <script type="text/javascript">
            $(function () {
                $("#rule").click(function (event) {
                    $(".mask").css("display", "block");
                    $("#activity_modal").addClass('activity_modal_animation')
                });
                $("#close").click(function (event) {
                    $(".mask").css("display", "none");
                    $("#activity_modal").removeClass('activity_modal_animation')
                });
            })
        </script>
        <script type="text/javascript">
        $(function () {
            var $container = $('.masonry');
            var status = 1;
            var product_name = "";
            var total_pages = 1;
            var isload = false;
            let dataUrl = '/ProductActivity/_ProductCashRedDrill';
            var mescroll = new MeScroll("mescroll", {
                down: {
                    auto: false,
                    callback: function (mescroll) {
                        mescroll.resetUpScroll();
                    }
                },
                up: {
                    callback: askData,
                    page: { num: 0, size: 6 },
                    clearEmptyId: "dataList",
                    isBounce: false,
                    noMoreSize: 3,
                    htmlNodata: '<p class="upwarp-nodata">亲,我是有底线的~</p >',
                    empty: { warpId: "dataList", icon: "", tip: "亲,暂时没有数据哦~" },
                    toTop: {}
                }
            });
            //异步请求数据
            function askData(pager) {
                if (!isload && total_pages >= pager.num) {
                    isload = true;
                    $.ajax({
                        type: "post",
                        url: dataUrl,
                        params: "contentType",
                        data: { page: pager.num, size: pager.size, activityId: '@Model.id' },
                        async: true,
                        success: function (res) {
                            var $elems = $(res);
                            var paged = $elems.siblings("page");
                            var rows = Number.parseInt(paged.attr("rows"));
                            var total = Number.parseInt(paged.attr("total_result"));
                            mescroll.endBySize(rows, total);
                            if (paged.length == 1) {
                                total_pages = Number.parseInt(paged.attr("total_pages"));
                                $container.append($elems);
                                $('#dataList page').remove();
                            }
                            isload = false;
                        },
                        error: function (err) {
                            isload = false;
                            mescroll.endErr();
                        }
                    });
                }
            }
        })
        </script>
    </body>

